<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix='fmt' uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Bootstrap, from Twitter</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <!-- Le styles -->
    <link href="<fmt:message key="project"  />/ui/bootstrap/css/bootstrap.css" rel="stylesheet">
    <style type="text/css">
      body {
        padding-top: 60px;
        padding-bottom: 40px;
      }
      .brand { font-family: georgia, serif; }
      .brand .first {
          color: #ccc;
          font-style: italic;
      }
      .brand .second {
          color: #fff;
          font-weight: bold;
      }
      @media (max-width: 980px) {
        /* Enable use of floated navbar text */
        .navbar-text.pull-right {
          float: none;
          padding-left: 5px;
          padding-right: 5px;
        }
      }
    </style>

    <link href="<fmt:message key="project" />/ui/bootstrap/css/bootstrap-responsive.css" rel="stylesheet">
    <link rel="stylesheet" href="<fmt:message key="project" />/ui/bootstrap/css/theme/theme.css">
    <link rel="stylesheet" href="<fmt:message key="project" />/ui/font-awesome/css/font-awesome.css">

    <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script type="text/javascript" src="ui/bootstrap/js/html5shiv.js"></script>
    <![endif]-->

    <!-- Fav and touch icons -->
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="../assets/ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../assets/ico/apple-touch-icon-114-precomposed.png">
      <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../assets/ico/apple-touch-icon-72-precomposed.png">
                    <link rel="apple-touch-icon-precomposed" href="../assets/ico/apple-touch-icon-57-precomposed.png">
                                   <link rel="shortcut icon" href="../assets/ico/favicon.png">
  </head>

  <body>

    <div class="navbar navbar-inverse navbar-fixed-top">
          <div class="navbar-inner">
            <div class="container-fluid">
                <ul class="nav pull-right">

                    <li id="fat-menu" class="dropdown">
                        <a href="#" id="drop3" role="button" class="dropdown-toggle" data-toggle="dropdown">
                            <i class="icon-user"></i>${sessionScope.user.userName}
                            <i class="icon-caret-down"></i>
                        </a>

                        <ul class="dropdown-menu">
                            <li><a tabindex="-1" href="<fmt:message key="project"  />/${sessionScope.user.userName}/setting.html"><fmt:message key="user.settings"  /></a></li>
                            <li class="divider"></li>
                            <li><a tabindex="-1" href="<fmt:message key="project"  />/logout.html"><fmt:message key="user.logout" /></a></li>
                        </ul>
                    </li>

                </ul>
                <a class="brand" href="<fmt:message key="project" />/index.html"><span class="first">i</span> <span class="second">WMS</span></a>
              </div><!--/.nav-collapse -->
            </div>
          </div>
        </div>

        <div class="container-fluid">
          <div class="row-fluid">
            <div class="span3">
              <div class="accordion sidebar-nav" id="accordion2">

                <div class="accordion-group">
                  <div class="accordion-heading nav-header">
                    <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
                      <i class="icon-briefcase"></i>
                      ${sessionScope.user.userName}
                    </a>
                  </div>
                  <ul id="collapseTwo" class="accordion-body nav nav-list collapse in">
                    <li><a href="setting.html"><fmt:message key="user.information"  /></a></li>
                    <li><a href="reset-password.html"><fmt:message key="user.updatePassword"  /></a></li>
                  </ul>
                </div>


              </div>
            </div><!--/span-->
            <div class="span9" style="margin-left: 0px;">
                <div class="row-fluid">
                    <div class="dialog" style="margin:0 0 0 0;width:600px;">
                        <div class="block"style="margin:0 0 0 0;">
                            <p class="block-heading"><fmt:message key="user.information"  /></p>
                            <div class="block-body">
                                <form action="updateInfo.html" method="post" id="Form1">
                                    <input type="hidden" name="userId" value="${sessionScope.user.userId}"/>
                                    <label><fmt:message key="user.name"  /></label>
                                    <input type="text" name="userRealName" value="${user.userRealName}" class="span7">
                                    <label><fmt:message key="user.username"  /></label>
                                    <input type="text" name="userName" value="${user.userName}" class="span7">
                                    <p>
                                        <button id="save_userInfo" class="btn btn-primary btn-large pull-left" tabindex="2"><fmt:message key="form.button.submit"  /></button>
                                    </p>
                                    <div class="clearfix"></div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div><!--/span-->
          </div><!--/row-->

          <hr>

          <footer>
            <p>&copy; Company 2013</p>
          </footer>

        </div><!--/.fluid-container-->

    <!-- Le javascript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script type="text/javascript" src="<fmt:message key="project" />/ui/jquery.js"></script>
    <script src="<fmt:message key="project" />/ui/bootstrap/js/bootstrap.js"></script>
    <script type="text/javascript">

    	$(function() {
    	    $('#save_userInfo').click(function(){
    	        var fields = $("#Form1").serializeArray();
    	        var param = {};
                $.each(fields, function(i,n){
                    param[n.name]=n.value;
                });
    	        $.post('updateInfo.html',param,function(r){
    	            alert(1);
    	        },'json');
    	    });

    	});
    </script>
  </body>
</html>
